/**
 * @description 组件样式
 * @author: 陈陈
 * @date: 2025/05/09
 * @phone: 18560000860
 * @email: 18560000860@qq.com
 * @company: 济南晨霜信息技术有限公司 /
 * @business: 承接前后端项目的开发
 */
.pure-tabbar {
	background: transparent;
	height: var(--pure-tabbar-component-height);

	&__container {
		background: var(--pure-tabbar-background, var(--pure-background-default));
	}

	&__list {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		height: var(--pure-tabbar-height, 50px);
		padding: var(--pure-tabbar-padding, 0 30px);
	}

	&__item {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		gap: var(--pure-tabbar-item-gap, 3px);

		&__icon {
			font-size: var(--pure-tabbar-icon-font-size, 20px);
			width: var(--pure-tabbar-icon-width, auto);
			height: var(--pure-tabbar-icon-height, 1em);
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			position: relative;
			--pure-icon-image-height: 100%;
			--pure-icon-image-width: 100%;
		}

		&__icon-wrap {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%) scale(0.6);
			transition: all 0.25s;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			text-align: center;
			line-height: 1;

			&--unselect {
				opacity: 1;
				transform: translate(-50%, -50%) scale(1);
			}

			&--selected {
				opacity: 0;
				transform: translate(-50%, -50%) scale(0.6);
			}
		}

		&__text {
			font-size: var(--pure-tabbar-text-font-size, 10px);
			font-weight: var(--pure-tabbar-text-font-weight, 500);
		}

		&--selected {
			color: var(--pure-tabbar-active-color, var(--pure-theme-primary));

			.pure-tabbar__item__icon-wrap--unselect {
				opacity: 0;
				transform: translate(-50%, -50%) scale(0.6);
			}

			.pure-tabbar__item__icon-wrap--selected {
				opacity: 1;
				transform: translate(-50%, -50%) scale(1);
			}
		}
	}

	&--safe-area-bottom {
		.pure-tabbar__container {
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
		}
	}

	&--is-fixed {
		.pure-tabbar__container {
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			z-index: var(--pure-z-index-middle, 900);
		}
	}
}
